// 导入必要的模块
import tailwindcss from '@tailwindcss/vite' // Tailwind Vite 插件
import { sveltekit } from '@sveltejs/kit/vite' // SvelteKit 集成插件
import { defineConfig, loadEnv } from 'vite' // Vite 核心模块
import { visualizer } from 'rollup-plugin-visualizer' // 打包分析插件
import cssnano from 'cssnano' // CSS 压缩工具

// 使用 defineConfig 定义 Vite 配置
export default defineConfig(({ mode }) => {
  // 加载环境变量（第三个参数空字符串表示加载所有前缀的变量）
  const env = loadEnv(mode, process.cwd(), '')

  // 获取 API 基础地址，优先使用环境变量
  const baseURL = env.VITE_API_BASE_URL || 'http://localhost:8000/'

  // 代理配置对象
  const proxyConfig = {
    '^/api/': {  // 匹配以 /api/ 开头的请求
      target: baseURL,         // 代理目标地址
      changeOrigin: true,     // 修改请求头 Origin
      secure: false,          // 禁用 SSL 验证
      ws: true,               // 代理 WebSocket
      headers: {              // 添加 CORS 头
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'GET,POST,PUT,DELETE,OPTIONS',
        'Access-Control-Allow-Headers': 'Content-Type,Authorization'
      },
      rewrite: (path: string) => path.replace(/^\/api/, ''), // 路径重写
      bypass: (req: any) => { // 请求绕过规则
        const url = req.url || ''
        const ext = url.split('.').pop() || ''
        // 静态资源扩展名白名单
        const staticExts = ['css', 'js', 'html', 'ico', 'svg', 'png', 'jpg', 'gif', 'woff2', 'woff', 'ttf']
        return staticExts.includes(ext) ? url : null
      }
    }
  }

  return {
    // 开发服务器配置
    server: {
      proxy: mode === 'development' ? proxyConfig : {}, // 开发环境启用代理
      open: true,       // 自动打开浏览器
      cors: true       // 启用基础 CORS 支持
    },

    // Vite 插件列表
    plugins: [
      tailwindcss({    // Tailwind 插件
        config: './tailwind.config.ts', // Tailwind 配置文件路径
        editorSupport: true             // 编辑器支持
      }),
      sveltekit(),      // SvelteKit 插件
      visualizer({      // 打包分析插件
        open: false,    // 不自动打开报告
        filename: '_stats/bundle-stats.html', // 输出文件名
        template: 'treemap',   // 使用树状图模板
        gzipSize: true,        // 显示 Gzip 大小
        brotliSize: true       // 显示 Brotli 大小
      })
    ],

    // CSS 相关配置
    css: {
      transformer: 'lightningcss', // 使用 Lightning CSS 转换器
      lightningcss: {
        drafts: {        // 启用实验性功能
          nesting: true, // CSS 嵌套草案
          customMedia: true // 自定义媒体查询
        },
        targets: {       // 浏览器兼容目标
          // 使用位运算表示 Chrome 95.0.0 (0x5F0000)
          chrome: 80 << 16
        },
        // 禁用所有新颜色格式，仅输出 rgb/rgba/hex
        color: false
      },
      postcss: {         // PostCSS 插件
        plugins: [
          cssnano({     // CSS 压缩
            preset: ['default', {
              discardComments: { removeAll: true }, // 移除注释
              normalizeWhitespace: false, // 保留空白
              colormin: false,    // 禁用颜色优化
              zindex: false       // 禁用 z-index 优化
            }]
          })
        ]
      }
    },

    // 生产构建配置
    build: {
      cssTarget: 'chrome80', // 指定 CSS 兼容目标
      emptyOutDir: true,    // 构建前清空输出目录
      sourcemap: mode === 'development', // 开发环境生成 sourcemap
      minify: mode === 'production' ? 'terser' : false, // 生产环境压缩
      rollupOptions: {      // Rollup 配置
        output: {
          manualChunks(id: string) { // 自定义代码分割
            if (id.includes('node_modules')) {
              // 定义库分组规则
              const libs = {
                '@codemirror': 'codemirror',
                'prismjs': 'prism',
                'firebase': 'firebase',
                '@sentry': 'sentry',
                '@poppanator': 'svg-utils'
              }
              // 查找匹配的库分组，否则归入 vendor
              return Object.entries(libs).find(([key]) => id.includes(key))?.[1] || 'vendor'
            }
          }
        }
      },
      terserOptions: {     // Terser 压缩配置
        compress: {
          drop_console: mode === 'production', // 生产环境移除 console
          drop_debugger: true,     // 移除 debugger
          passes: 2                // 压缩次数
        },
        format: {
          comments: false,        // 移除注释
          ecma: 2020             // 使用 ES2020 语法
        }
      },
      chunkSizeWarningLimit: 800 // 分块大小警告阈值 (KB)
    },

    // 资源处理配置
    assetsInclude: ['**/*.wasm'], // 识别 WebAssembly 文件
    json: {
      namedExports: true, // 允许具名导出
      stringify: false    // 禁用 JSON 字符串化
    }
  }
})